<template>
  <div>
    <van-nav-bar title="社区一站式服务中心" />
    <van-space>
      <!-- <van-button type="primary" size="small" plain @click="refresh" >刷新</van-button>
    <van-button type="primary" size="small" plain @click="openEdit('')" >新增</van-button> -->
    <van-button type="primary" size="small" plain block @click="openEdit('')" >信息员报名表</van-button>
    </van-space>
    <van-empty v-if="!data" description="暂无数据" />
    <van-list
  v-model:loading="loading"
  :finished="finished"
  finished-text="没有更多了"
  @load="onLoad"
>
  <van-cell v-for="item in data" :key="item.id" :title="item.title" @click="openEdit(item.id)" />
</van-list>
    

  </div>
</template>

<script type="ts">
export default {
  name: 'ArchivesList',
};
</script>
<script setup type="ts">
import { ref,reactive,onMounted } from 'vue';
import { useRouter } from 'vue-router';

import { MessagePlugin } from 'tdesign-vue-next';

import { DRAFTS_COLUMNS } from './constants';

import { useLocale } from '@/locales/useLocale';
import dayjs from 'dayjs'
import { saveArchive,deleteArchive,getArchive,getAllArchive } from '@/api/archives';


const { locale } = useLocale();
const searchKey = ref('');
const router=useRouter();
const data = ref([]);
const pagination = reactive({
  current: 1,
  pageSize: 20,
  total: 0,
});
const dataLoading = ref(false);
const selectedRowKeys = ref([]);
    
const loading=ref(false)
const finished=ref(false)
const onLoad = async (loadMore) => {
  
await fetchData()
};
const fetchData = async (d) => {
  dataLoading.value = true;loading.value = true;
  try {
    const {items,totalItems,currentPage}=await getAllArchive(d);
    data.value = items;
    pagination.total = totalItems;
    pagination.current = currentPage;
    

  } catch (e) {
    console.log(JSON.stringify(e))
  } finally {
    dataLoading.value = false;
    loading.value = false;
  }
};
// 刷新数据
const refresh = async () => {
  pagination.current = 1;
  await fetchData(pagination);
};

const rehandlePageChange = (pageInfo) => {
  console.log(`rehandlePageChange${JSON.stringify(pageInfo)}`);
  pagination.current = pageInfo.current;
  pagination.pageSize = pageInfo.pageSize;
  fetchData(pageInfo);
};

const rehandleSelectChange = (val) => {
  selectedRowKeys.value = val;
};

const openEdit=(id)=>{
  const params={id:id}
  router.push({
    name:'archivesEdit',
    params:{id:id}
  })
}


onMounted(async () => {
  await fetchData({
    current: pagination.current,
    pageSize: pagination.pageSize,
  });

});


// 日期选择
const onPick = (value, context) => console.log('onPick:', value, context);
const onPickChange = (value, context) => {
  console.log('onPickChange:', value, context);
  console.log(
    'timestamp:',
    context.dayjsValue.map((d) => d.valueOf()),
  );
  console.log(
    'YYYYMMDD:',
    context.dayjsValue.map((d) => d.format('YYYYMMDD'))
  );

   fetchData({
    current: pagination.current,
    pageSize: pagination.pageSize,
    date:`${value[0],value[1]}`
  });
};

</script>

<style lang="less" scoped>

</style>
